<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>第三章作业</title>
    <style>
        h1{
            text-align: center;
           letter-spacing: 3px;  
        }
        .a{
            text-align: center;
            font-size: 1px;
            line-height: 50px;
        }
        .left{
            float: left;
             width: 50%;
        }
        .img{
            width: 580px;
            height: 250px;
        }
        .right{
            float: right;
            width: 50%;
        }
        ul{
            font-size: 13px;
            list-style-type: square;
            line-height: 30px;
        }
        hr{
            height:1px;border:none;border-top:1px solid #5f5c5c;
        }
    </style>
   </head>
<body>
    <h1>把握<span style="color: rgb(81, 147, 247);">移动端字体设计</span>的七大准则</h1>
    <div class="a">
        <p>更新时间：<span style="color: rgb(81, 147, 247);">2020年06月06日17时26分</span>
            <span style="padding-left: 20px;">来源：</span><span style="color: rgb(81, 147, 247);">问答精灵</span></p>
    </div>
        <div class="left">
            <img src="1212.jpg" class="img">
        </div>
        <div class="right">
            <ul>
                <li><span style="color: red;">留足空间，字体并非弯弯曲曲的线条排列</span>，它主要在于周围和相互间的空间。
                <li>行宽是一行文字的长度，<span style="color: red;">是一行文字的理想长度</span>，因为很难让每一行都准确吻合。
                <li>行距是行之间的空间，行距太紧凑，<span style="color: red;">会让视线难以从行尾扫视到下一行首。</span>
                <li>所有字体至少都有一种最佳状态，<span style="color: red;">便字体在浏览器中最能保持字形的抗锯齿选项</span>。
                <li>你读的多数内容是<span style="color: red;">居左对齐，右边沿参差不齐的</span>，这样看起来更<span style="color: red;">有节奏。</span>
                <li>增强文字与背景对比的同时，我们也要<span style="color: red;">减少不同层次文字间的反差</span>。
                <li><span style="color: red;">按比全调整字间距</span>，为移动端调整字号时，要意识到字间距发生了必要的变化。
            </ul>
           <hr>
           <p style="font-style:italic;font-size:5px;"><span style="color: darkgray;">原文链接：</span><a href="dsz.html" style="color:rgb(81, 147, 247) ;">file:///C:/Users/Administrator/Desktop/test/第三章作业.dsz.html</a>
        <span style="padding-left:20px;color: darkgray;">文章分类：</span><span>艺术设计</span></p>
        </div>
</body>
<ml>